<!--
 * @Descripttion: 
 * @version: 
 * @Author: cyj
 * @Date: 2022-12-08 20:35:50
-->
<template>
    <div class="find-music">
        <!-- 顶部导航  通过props传递数据-->
        <TopNavVue :tabitem="TabItem"></TopNavVue>
        <!-- 内容展示区 -->
        <div class="music-content w">
            <router-view></router-view>
        </div>

    </div>
</template>

<script setup>
import { reactive } from 'vue';
import TopNavVue from '../../components/TopNav.vue';

const TabItem = reactive([
    {name:'个性推荐',path:'/findmusic/discover'},
    {name:'歌单',path:'/findmusic/songlist'},
    {name:'排行榜',path:'/findmusic/songrank'},
    {name:'歌手',path:'/findmusic/singer'},
    {name:'最新音乐',path:'/findmusic/newsongs'},

])
</script>

<style lang="scss" scoped>
// .music-content {
//     // 超过页面部分实现滚动
//     // overflow-y: scroll;
// }
</style>